@import 'theme';
@import 'functions';
@import 'mixins';

//mini-cart color variables
$cx-mini-cart-button-background-color: 'primary' !default;
$cx-mini-cart-button-color: 'inverse' !default;

//mini-cart variables
$cx-mini-cart-button-height: 50px !default;
$cx-mini-cart-button-border-radius: 0 !default;
$cx-mini-cart-button-md-height: 60px !default;
$cx-mini-cart-button-md-trbl-padding: 0.5rem 0.75rem 0 0.75rem !default;
$cx-mini-cart-icon-width: 25px !default;
$cx-mini-cart-count-trbl-margin: 0 0 0 0.35rem !default;

.cx-mini-cart {
  //these are temp fixes until store finder
  //gets back to its original position
  @include media-breakpoint-up(xs) {
    margin-left: 1rem;
  }
  @include media-breakpoint-up(sm) {
    margin-left: 1.5rem;
  }

  &__button {
    @include var-color(
      'background-color',
      $cx-mini-cart-button-background-color
    );
    @include var-color('color', $cx-mini-cart-button-color);
    position: relative;
    height: $cx-mini-cart-button-height;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-radius: $cx-mini-cart-button-border-radius;
    margin-right: 1rem;
    @include media-breakpoint-down(sm) {
      flex-direction: column;
      height: $cx-mini-cart-button-md-height;
      padding: $cx-mini-cart-button-md-trbl-padding;
      margin-right: 1.5rem;
    }
    @include media-breakpoint-up(lg) {
      margin-right: 0;
    }
  }
  &__icon {
    width: $cx-mini-cart-icon-width;
    fill: currentColor;
    pointer-events: none;
  }
  &__count {
    margin: $cx-mini-cart-count-trbl-margin;
  }
}
